<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8" />
		<title>货拉拉-下订单-处于各个城市-选择各种车型-请先登录</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<!--页面完全加载好之前显示的加载动画效果-->
		<link rel="stylesheet" href="commonCSS/CSSLoadingAnimation01.css" type="text/css" />
		<!--初始化css样式引入的css文件-->
		<link rel="stylesheet" href="commonCSS/commonInitialize.css" type="text/css" />
		<link rel="stylesheet" href="commonCSS/htmlFontSize.css" />
		<link rel="stylesheet" href="commonCSS/commonDisplayFlex.css" />
		<!--HTML页面顶部盒子header区域的通用样式文件-->
		<link rel="stylesheet" type="text/css" href="commonCSS/headerCommon.css" />
		<link rel="stylesheet" href="css-take-order/take-order.css" />
		<!--个人信息填写的样式表也要记得引入-->
		<link rel="stylesheet" href="commonCSS/personal-info.css" />
		<link rel="stylesheet" href="commonCSS/footerCommon.css" />
		<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
		<script type="text/javascript">
			
			window.addEventListener("load", function() {
				document.getElementsByClassName("loading1")[0].remove();
				/*整个网页加载好后（包括图片等），就移除这个动画元素，应该可以减少DOM树的分支*/
			});
		</script>
	</head>

	<body>

		<!--这个网页加载动画元素的div要放在body下面的第一个子元素的位置，因为是要在加载后面的所有元素之前运行动画的-->
		<div class="loading1">
			<div class="loading01">
				<div>加载中，稍等……<br />loading……</div>
				<span></span>
				<span></span>
				<span></span>
			</div>
		</div>
		<style type="text/css">
			#show-reminder-div {
				display: none;
				position: fixed;
				width: 100%;
				height: 100%;
				left: 0;
				top: 0;
				z-index: 9999;
				background: rgba(99, 97, 95, 0.9);
			}
			
			#show-reminder-div>div {
				padding: 1.25rem 0.25rem 0.1rem;
				position: relative;
				width: 60vw;
				height: auto;
				text-align: center;
				border-radius: 0.2rem;
				box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
				background: white;
				margin: 0.5rem auto;
				line-height: 1rem;
				font-size: 0.24rem;
			}
			
			#show-reminder-div #show-reminder-img {
				display: block;
				width: 100%;
				max-width: 750px;
				height: auto;
				margin: 0.4rem auto;
				border: #CCCCCC solid 0.02rem;
				box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
			}
			
			.close-reminder-img {
				position: absolute;
				right: 0.2rem;
				top: 0.2rem;
				display: block;
				width: 1rem;
				height: 1rem;
				font-size: 1rem;
				color: orange;
				cursor: pointer;
			}
		</style>
		<!--关于进行手机号隐藏保护的提示盒子div-->
		<div id="show-reminder-div">
			<div>
				<span class="close-reminder-img">&otimes;</span>
				<div>
					号码保护 开启号码保护将隐藏您的真实号码，司机只能通过虚拟号码与您联系
				</div>
				<img id="show-reminder-img" src="https://webapp.huolala.cn/rs/images/img_privacy.png" />
				<div>
					<strong>
					1. 号码保护不会向您额外增收费用，该费用由货拉拉承担。
				</strong>
					<br />
					<strong>
					2. 号码服务提供商出现服务故障时，您与司机都将以真实号码进行联系，以确保订单能够正常进行。
				</strong>
				</div>
			</div>
		</div>

		<!--header区域开始 start-->
		<header id="header-area">
			<div id="header-div1">
				<!--<div class="show-or-hide-div"></div>-->
				<ul class="header-ul display-flex flex-wrap flex-justify-center flex-align-content-space-between">
					<li class="header-li">
						<a href="javascript:;">
							<img src="img-first-page/img_nav_logo.png" alt="" />
						</a>
					</li>
					<li class="header-li">
						<a href="index.html">首页</a>
					</li>
					<li class="header-li">
						<a href="house-move.html">搬家</a>
					</li>
					<li class="header-li">
						<a href="https://www.huolala.cn/big_truck.html">大货车</a>
					</li>
					<li class="header-li">
						<a href="https://www.hllep.com/">企业版</a>
					</li>
					<li class="header-li">
						<a href="driverJoin.html">司机加入</a>
					</li>

					<li class="header-li">
						<a href="https://lalamc.huolala.cn/">租买货车</a>
					</li>
					<li class="header-li">
						<a href="https://open.huolala.cn/">开放平台</a>
					</li>
					<li class="header-li" id="allocate-goods">
						<a href="javascript:;">发物流<img src="img-first-page/ic_job_arrow_down.png" alt="向下箭头" /></a>
						<ul class="goods-expression-ul">
							<li>
								<a href="https://wuliu.huolala.cn/" target="_blank">国内物流</a>
							</li>
							<li>
								<a href="https://www.h66.cn/" target="_blank">国际物流</a>
							</li>
						</ul>
					</li>
					<li class="header-li" id="about-us">
						<a href="javascript:;">关于我们<img src="img-first-page/ic_job_arrow_down.png" alt="向下箭头" /></a>
						<ul class="about-us-ul">
							<li>
								<a href="https://www.huolala.cn/about_us.html" target="_blank">关于我们</a>
							</li>
							<li>
								<a href="https://www.huolala.cn/join_us.html" target="_blank">加入我们</a>
							</li>
							<li>
								<a href="https://www.huolala.cn/contact_us.html" target="_blank">联系我们</a>
							</li>
							<li>
								<a href="javascript:void(0);" target="_blank">全国站点</a>
							</li>
							<li>
								<a href="https://www.huolala.cn/news_list.html" target="_blank">最新动态</a>
							</li>
						</ul>
					</li>
					<li class="header-li">
						<a href="javascript:;">下载App</a>
					</li>
					<li class="header-li search-li">

						<div class="search-div display-flex flex-justify-center flex-align-items-center">
							<input type="search" class="search-input" value="" />
							<input type="button" value="" />
						</div>
					</li>
				</ul>
			</div>
		</header>

		<!--header 部分结束 end-->
		<script type="text/javascript">
			let h1 = document.querySelector("header");

			function adjustPosition() {
				if(window.innerHeight >= document.documentElement.offsetHeight) {
					h1.style.position = "relative";
					return;
				}
				h1.style.position = "fixed";
			}
			window.onload = function() {
				adjustPosition();
			}
			window.onresize = function() {
				adjustPosition();
			}
		</script>
		<section id="main-section" class="display-flex flex-wrap flex-justify-space-around flex-align-items-start">
			<nav id="nav-area">
				<ul>
					<li>
						<a href="take-order.html">
							<div><i class="fa fa-truck"></i></div>叫车</a>
					</li>
					<li>
						<a href="look-my-order.html">
							<div><i class="fa fa-dropbox"></i></div>我的订单</a>
					</li>
					<li>
						<a href="driver-order.html">
							<div><i class="fa fa-car"></i></div>我的司机</a>
					</li>
				</ul>
			</nav>
			<!--section区域开始 start-->
			<section id="section-area">
				<!--轮播图开始 start-->
				<div class="carousel-div1">
					<ul class="display-flex flex-justify-space-around align-items-center">

						<li class="car-li display-flex flex-justify-space-around align-items-center">
							<a href="javascript:;">
								<img src="img-first-page/minibus_small_v2.png" alt="小面包车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>小面</dt>
										<dd>
											<span>载重：</span>
											<span>800公斤</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>1.8 * 1.3 * 1.1</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>2.6方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/minibus_big_v2.png" alt="中型面包车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>中面</dt>
										<dd>
											<span>载重：</span>
											<span>1吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>2.4 * 1.4 * 1.2</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>4.0方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/flat_bed_trailer_large_v2.png" alt="依维柯货车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>依维柯</dt>
										<dd>
											<span>载重：</span>
											<span>1.5吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>2.7 * 1.5 * 1.7</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>6.9方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/iveco_v2.png" alt="中平板车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>中平板</dt>
										<dd>
											<span>载重：</span>
											<span>1.8吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>4.2 * 1.8 * 1.8</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>13.6方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>

						</li>
						<li class="car-li display-flex flex-justify-space-around align-items-center">
							<a href="javascript:;">
								<img src="img-first-page/van_big_v2.png" alt="中货厢车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>中厢货</dt>
										<dd>
											<span>载重：</span>
											<span>1.8吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>4.2 * 1.8 * 1.8</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>13.6方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/flat_bed_trailer_small_v2.png" alt="小型平板车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>小平板</dt>
										<dd>
											<span>载重：</span>
											<span>1.5吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>2.7 * 1.5 * 1.7</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>6.9方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/flat_bed_trailer_big_6_8_gaolan_v1.png" alt="5米2的车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>5米2</dt>
										<dd>
											<span>载重：</span>
											<span>4吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>5 * 2.1 * 2.0</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>21.0方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/flat_bed_trailer_big_7_6_gaolan_v1.png" alt="6米8的车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>6米8</dt>
										<dd>
											<span>载重：</span>
											<span>8吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>6.4 * 2.3 * 2.4</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>35.3方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>

						</li>
						<li class="car-li display-flex flex-justify-space-around align-items-center">
							<a href="javascript:;">
								<img src="img-first-page/flat_bed_trailer_big_9_6_gaolan_v1.png" alt="7米6的车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>7米6</dt>
										<dd>
											<span>载重：</span>
											<span>8吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>7.3 * 2.3 * 2.5</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>42.0方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
							<a href="javascript:;">
								<img src="img-first-page/5米2型货车.png" alt="9米6的货车图片" />
								<div>小平板，中平板</div>
								<div class="info-div">
									<dl>
										<dt>9米6</dt>
										<dd>
											<span>载重：</span>
											<span>10吨</span>
										</dd>
										<dd>
											<span>长宽高：</span>
											<span>9.0 * 2.3 * 2.5</span>
										</dd>
										<dd>
											<span>载货体积：</span>
											<span>51.8方（㎡）</span>
										</dd>
									</dl>
								</div>
							</a>
						</li>
					</ul>
					<ul class="order-pointers display-flex flex-justify-center align-items-center clear-float"></ul>

				</div>
				<!--轮播图结束 end-->
				<!--特殊规格选择开始start-->
				<div class="special-rules">
					<strong>特殊规格（单选）</strong>
					<div>
						<a href="javascript:;" class="selection-of-cars">
							厢式货车
							<strong class="money">(￥0)</strong>
						</a>
						<a href="javascript:;" class="selection-of-cars">
							平板货车
							<strong class="money">(￥0)</strong>
						</a>
						<a href="javascript:;" class="selection-of-cars">
							高栏货车
							<strong class="money">(￥0)</strong>
						</a>
					</div>
				</div>
				<!--特殊规格选择结束 end-->
				<!--输入起点、目的地（必填）-->
				<div id="destination-and-address">
					<div class="destination-head clear-float">
						<strong>输入起点、目的地（必填）</strong>
						<div class="float-right">
							<a href="javascript:;" class="orange-text-and-border">使用常用路线下单 →</a>
						</div>
					</div>
					<style type="text/css">
						#input-destination>div:not(:last-of-type) {
							width: 100%;
							height: 1rem;
							margin: 0.2rem auto;
							box-sizing: border-box;
							border-bottom: 0.03rem solid #CCCCCC;
						}
						
						#input-destination>div:not(:last-of-type)>div:nth-of-type(1) {
							width: 1rem;
							height: 1rem;
							box-sizing: border-box;
							position: relative;
						}
						
						#input-destination>div:not(:last-of-type)>div:nth-of-type(2) input {
							width: 50%;
							min-width: 70px;
							height: 100%;
							padding: 0.1rem;
						}
						
						.circle-dots {
							display: block;
							position: absolute;
							top: 0;
							left: 0;
							width: 0;
							height: 0;
							border-style: solid;
							border-width: 0.2rem;
							border-top-width: 0.5rem;
						}
						
						#start-point .circle-dots {
							border-color: green transparent transparent;
						}
						
						.other-destinations .circle-dots {
							border-color: #CCCCCC transparent transparent;
						}
						
						#last-destination .circle-dots {
							border: none;
							width: 30%;
							height: 30%;
							margin: 35% 15%;
							border-radius: 50%;
							background: #F16622;
						}
						
						#input-destination>div>div canvas {
							width: 1rem;
							height: 1rem;
						}
						
						#input-destination>div>div:nth-of-type(2) {
							flex: 1;
							height: 100%;
							box-sizing: border-box;
						}
						
						.other-destinations {
							position: relative;
						}
						
						.other-destinations:nth-of-type(1) {
							display: none;
						}
						
						.other-destinations .remove-destination {
							position: absolute;
							right: 0;
							top: 0;
							width: 0.3rem;
							height: 0.3rem;
							margin: 0.35rem;
							background: #666;
							color: white;
							border-radius: 50%;
							font-size: 0.3rem;
							/*text-align: center;*/
							line-height: 0.3rem;
						}
						
						#input-destination>div:nth-last-of-type(1) {
							width: 100%;
							padding: 0.2rem;
						}
						
						.add-destination {
							white-space: nowrap;
							width: auto;
							cursor: pointer;
							text-overflow: ellipsis;
							text-align: center;
						}
						
						.add-destination span {
							font-size: 0.4rem;
						}
					</style>
					<div id="input-destination">
						<!--起点-->
						<div id="start-point" class="display-flex flex-justify-space-between align-items-center">
							<div>
								<span class="circle-dots"></span>
							</div>
							<div>
								<input type="text" placeholder="按此输入起点" />
							</div>
						</div>
						<!--其他目的地-->
						<div class="other-destinations display-flex flex-justify-space-between align-items-center">
							<div>
								<span class="circle-dots"></span>
							</div>
							<div>
								<input type="text" placeholder="输入其他中间目的地" />
							</div>
							<div class="remove-destination">&otimes;</div>
						</div>
						<!--最终目的地-->
						<div id="last-destination" class="display-flex flex-justify-space-between align-items-center">
							<div>
								<span class="circle-dots"></span>
							</div>
							<div>
								<input type="text" placeholder="按此输入目的地" />
							</div>

						</div>
						<div class="clear-float">
							<div class="add-destination float-right orange-text-and-border">
								<span>&oplus;</span> 添加目的地
							</div>
						</div>

					</div>
				</div>

				<!--填写额外需求的ul列表-->
				<ul id="extra-input-area">
					<li>
						<h2>额外需求（选填）</h2>
					</li>
					<li class="display-flex flex-justify-start align-items-center clear-float">
						<div>
							<i class="fa fa-id-badge"></i>
							<a href="javascript:;">
								优先发送订单给我的司机
							</a>
						</div>
						<div class="float-right">
							<div>
								<a href="javascript:;" class="circle-a"></a>
							</div>
						</div>

					</li>
					<li class="display-flex flex-justify-start align-items-center clear-float ul-slide-in">
						<div>
							<i class="fa fa-plus" style="font-size:36px"></i>
							<a href="javascript:;">
								添加额外需求
							</a>
						</div>
					</li>
					<li id="other-info-li" class="display-flex flex-justify-start align-items-center">
						<div>
							<i class="fa fa-commenting-o"></i>
						</div>
						<div>
							<textarea id="other-info-textarea" rows="" cols="" placeholder="可填写注意事项，例如行驶路线，时间等"></textarea>
						</div>
					</li>
					<li class="display-flex flex-justify-start align-items-center clear-float">
						<div class="protect-info">
							<i class="fa fa-phone-square"></i>
							<i class="fa fa-shield"></i>
							<strong>号码保护(对司机隐藏您的真实号码，保护您的隐私)</strong>
						</div>
						<div class="float-right">
							<div>
								<a href="javascript:;" class="circle-a"></a>
							</div>
						</div>

					</li>
					<li>
						<ul id="add-extra-conditions">
							<li>
								<label class="display-flex flex-justify-space-around align-items-center">
								<strong>
									添加额外需求
								</strong>
								<span class="ul-slide-out">&otimes;</span>
							</label>
							</li>
							<li>
								<label class="display-flex flex-justify-start align-items-center">
								<input type="checkbox" value="搬运 (司机另议)" name="extraCondition" />
								<strong>搬运(司机另议)</strong>
							</label>
							</li>
							<li>

								<label class="display-flex flex-justify-start align-items-center">
								<input type="checkbox" value="返程(附加40%路费)" name="extraCondition" />
								<strong>返程(附加40%路费)</strong>
							</label>
							</li>
							<li>
								<label class="display-flex flex-justify-start align-items-center">
								<input type="checkbox" value="小推车(免费)" name="extraCondition" />
								<strong>小推车(免费)</strong>
							</label>
							</li>
							<li>
								<label class="display-flex flex-justify-start align-items-center">
								<input type="checkbox" value="拍照回单(免费)" name="extraCondition" />
								<strong>拍照回单(免费)</strong>
							</label>
							</li>
							<li>
								<label class="display-flex flex-justify-start align-items-center">
								<input type="checkbox" value="纸质回单(商议价格)" name="extraCondition" />
								<strong>纸质回单(商议价格)</strong>
							</label>
							</li>
							<li>
								<label class="display-flex flex-justify-start align-items-center">
								<input type="checkbox" value="代收货款(免费：货款上限为一万元)" name="extraCondition" />
								<strong>代收货款(免费：货款上限为一万元)</strong>
							</label>
							</li>

						</ul>
					</li>
				</ul>

			</section>
			<aside id="aside-area">
				<div id="contact-person-div">
					<div>
						<strong>联系人资料（必填）</strong>
					</div>
					<div>
						<label class="display-flex flex-justify-center align-items-center">
						<div>
							<i class="fa fa-id-badge"></i>
						</div>
						<input type="text" id="person-name" placeholder="联系人称呼" />
					</label>
						<label class="display-flex flex-justify-center align-items-center">
						<div>
							<i class="fa fa-phone-square"></i>
						</div>
						<input type="text" id="person-phone-number" placeholder="联系人电话" />
					</label>
					</div>
					<div>
						<strong>跟车人数（必填）</strong>
						<br />
						<span>为保障用车安全，跟车人数请勿超过2人</span>
					</div>
					<div id="follow-car-person" class="display-flex flex-justify-space-around align-items-center">
						<a href="javascript:;">不跟车</a>
						<a href="javascript:;">1人跟车</a>
						<a href="javascript:;">2人跟车</a>
					</div>
				</div>
				<style type="text/css">
					#calc-sum-money {
						margin: 0.4rem auto;
						height: auto;
						width: 100%;
						background: rgb(251, 248, 246);
					}
					
					#calc-sum-money>div {
						width: 100%;
						box-sizing: border-box;
						text-align: center;
					}
					
					#calc-sum-money strong {
						font-weight: normal;
					}
					
					#calc-sum-money>div:nth-of-type(1) a,
					#calc-sum-money>div:nth-last-of-type(1) a {
						display: block;
						width: 50%;
						height: auto;
						white-space: nowrap;
						font-size: 0.3rem;
						color: #F16622;
						padding: 0.3rem 0.1rem;
					}
					
					#calc-sum-money>div:nth-last-of-type(1) a:nth-of-type(1) {
						background: rgb(255, 102, 0);
						color: white;
					}
					
					#calc-sum-money>div:nth-last-of-type(1) a:nth-of-type(2) {
						background: rgb(255, 160, 0);
						color: white;
					}
				</style>
				<div id="calc-sum-money">
					<div class="display-flex flex-justify-center align-items-center">
						<a href="javascript:;">
							费用明细
						</a>
						<a href="javascript:;">
							<strong id="sum-money">---</strong>元
						</a>
					</div>
					<div><strong>高速费、停车费与司机协商</strong></div>
					<div class="display-flex flex-justify-center align-items-center" id="call-car">
						<a id="now-call-car" href="javascript:;"><strong>现在用车</strong></a>
						<a id="pre-call-car" href="javascript:;"><strong>预约用车</strong></a>
					</div>
				</div>
				<!--个人信息填写的大盒子div开始 start-->
				<div id="personal-info-div1">
					<div id="personal-info-div2" class="display-flex flex-direction-column flex-justify-space-around flex-align-items-center">
						<header id="personal-info-header">
							<h1>个人信息(personal information)</h1>
							<span class="close-personal-info-div">&otimes;</span>
						</header>
						<nav id="personal-info-nav">
							<ul class="display-flex flex-justify-space-around align-items-center">
								<li>
									<a href="javascript:;"><strong>个人信息</strong></a>
								</li>
								<li>
									<a href="javascript:;"><strong>车辆信息</strong></a>
								</li>
								<li>
									<a href="javascript:;"><strong>照片信息</strong></a>
								</li>
							</ul>
						</nav>
						<section id="personal-info-section">
							<form action="" id="personal-info-form">
								<div class="info-input-div">
									<label>
									<em>姓名：</em>
									<input type="text" id="user-name" placeholder="请输入真实姓名" />
								</label>
								</div>
								<div class="info-warn-div">
									<i class="fa fa-exclamation-circle"></i><span>缺少您的真实姓名</span>
								</div>
								<div class="info-input-div">
									<label>
									<em>身份证号：</em>
									<input type="text" id="id-number" placeholder="请输入身份证号" />
								</label>
								</div>
								<div class="info-warn-div">
									<i class="fa fa-exclamation-circle"></i><span>缺少您的身份证号</span>
								</div>
								<div class="info-input-div">
									<label>
									<em>紧急联系人：</em>
									<input type="text" id="urgent-person-name" placeholder="请输入紧急联系人姓名" />
								</label>
								</div>
								<div class="info-warn-div">
									<i class="fa fa-exclamation-circle"></i><span>缺少紧急联系人姓名</span>
								</div>
								<div class="info-input-div">
									<label>
									<em>紧急联系人电话：</em>
									<input type="text" id="urgent-phone-number" placeholder="请输入紧急联系人电话" />
								</label>
								</div>
								<div class="info-warn-div">
									<i class="fa fa-exclamation-circle"></i><span>缺少紧急联系人电话</span>
								</div>
							</form>
						</section>
						<!--section区域结束 end-->
						<!--footer区域开始 start-->
						<footer id="personal-info-footer">
							<a class="display-block" href="javascript:;">
								下 一 步
							</a>
						</footer>
					</div>
				</div>
				<script type="text/javascript">
					let closePersonalDiv = document.getElementsByClassName("close-personal-info-div")[0];
					let personalDiv = document.getElementById("personal-info-div1");
					let callCar = document.getElementById("call-car");
					callCar.addEventListener("click", function() {
						personalDiv.style.zIndex = "9999";
						personalDiv.style.opacity = "1";
					});
					closePersonalDiv.addEventListener("click", function() {
						personalDiv.style.zIndex = "-1";
						personalDiv.style.opacity = "0";
					});
				</script>
			</aside>
		</section>
		<!--section区域结束 end-->
		<!--footer start-->
		<footer id="footer-area">
			<div class="others display-flex flex-wrap flex-justify-space-between flex-align-items-start">
				<div class="other-links">
					<!--存放公司基本业务的链接-->
					<div id="dl-div" class="display-flex flex-justify-space-around flex-align-items-start">
						<dl>
							<dt>首页</dt>
							<dd>
								<a href="index.html">产品首页</a>
							</dd>
						</dl>
						<dl>
							<dt>关于</dt>
							<dd>
								<a href="https://www.huolala.cn/about_us.html">关于我们</a>
							</dd>
							<dd>
								<a href="https://www.huolala.cn/join_us.html">加入我们</a>
							</dd>
							<dd>
								<a href="https://www.huolala.cn/contact_us.html">联系我们</a>
							</dd>
						</dl>
						<dl>
							<dt>咨询</dt>
							<dd>
								<a href="https://www.huolala.cn/company.html">公司动态</a>
							</dd>
							<dd>
								<a href="https://www.huolala.cn/industry.html">行业动态</a>
							</dd>
							<dd>
								<a href="https://www.huolala.cn/financing.html">融资快报</a>
							</dd>
						</dl>
						<dl>
							<dt>帮助</dt>
							<dd>
								<a href="https://www.huolala.cn/questions.html">常见问题</a>
							</dd>
							<dd>
								<a href="https://www.huolala.cn/feedback.html">意见反馈</a>
							</dd>
						</dl>
					</div>

					<div class="friendly-links">
						<h2>
						友情链接
					</h2>
						<div>
							<a href="https://auto.china.com/">中华汽车网</a>
							<a href="https://e.huolala.cn/" rel="nofollow">货拉拉企业版</a>
							<a href="http://www.shushi100.com/" rel="nofollow">中央空调</a>
							<a href="http://www.86huoche.com/" rel="nofollow">86货车网</a>
							<a href="http://www.jmw.com.cn/" rel="nofollow">中国加盟网</a>
							<a href="https://www.tyncar.com/" rel="nofollow">电动汽车</a>
							<a href="https://www.chezhanri.com/" rel="nofollow">车展日车展网</a>
							<a href="javascript:;" rel="nofollow">汽车家园</a>
							<a href="javascript:;" rel="nofollow">欣欣汽车时刻表</a>
							<a href="javascript:;" rel="nofollow">深圳二手房</a>
							<a href="javascript:;" rel="nofollow">新能源汽车</a>
							<a href="javascript:;" rel="nofollow">深圳装修</a>
							<a href="javascript:;" rel="nofollow">平行进口车</a>
							<a href="javascript:;" rel="nofollow">科目一</a>
							<a href="javascript:;" rel="nofollow">汽车报价大全</a>
							<a href="javascript:;" rel="nofollow">企业名录</a>
							<a href="javascript:;" rel="nofollow">九九信息网</a>
							<a href="javascript:;" rel="nofollow">汽车改装</a>
						</div>
					</div>
					<div class="private-policy">
						<a href="https://www.huolala.cn/privacy.html" rel="nofollow">隐私政策</a>
						<a href="https://www.huolala.cn/terms.html" rel="nofollow">条款及条件</a>
						<a href="index.html" rel="nofollow">深圳货拉拉科技有限公司</a>
						<a href="https://www.huolala.cn/m/index.html" rel="nofollow">移动端官网</a>
					</div>
					<div class="beian-note">
						<a href="http://beian.miit.gov.cn/" rel="nofollow">粤ICP备14091972号</a>
						<a href="javascript:;" rel="nofollow">增值电信业务经营许可证：粤B2-20170272</a>
						<a href="javascript:;" rel="nofollow">营业执照</a>
					</div>

				</div>
				<div class="focus-on-us">
					<h3>关注我们</h3>
					<ul class="focus-ul display-flex flex-wrap flex-justify-space-around flex-align-content-start flex-align-items-start">
						<li><strong>官方订阅号</strong><img src="img-first-page/扫码关注1.png" alt="扫码关注货拉拉微信公众账号图片" /></li>
						<li><strong>官方服务号</strong><img src="img-first-page/hll_user_20191216.png" alt="扫描货拉拉下单图片" /></li>
					</ul>
					<div class="call-us">
						<a href="tel:10103636"><strong>客服电话：10103636</strong></a>
					</div>
				</div>
			</div>
			<!--固定定位在窗口右边的回到顶部，联系客服的盒子div-->
			<div class="fixed-right-div">
				<div id="contactUs">
					<a href="">
						<img src="img-first-page/联系客服02.png" alt="联系客服、在线客服" />
						<br />
						<span>在线客服</span>
					</a>
				</div>
				<div id="toTop">
					<img src="img-first-page/回到顶部.png" alt="" />
					<br /> 回到顶部

				</div>

			</div>

		</footer>
		<!--footer end-->
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script src="commonJS/scrollToTop.js"></script>
		<script type="text/javascript" src="js-take-order/js-take-order.js"></script>
	</body>

</html>